<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
    <title>Title</title>
    <style>
        table, th, tr, td {
            border: 1px solid blue;
        }
    </style>
</head>
<script src="js/jquery-3.1.1.min.js" type="text/javascript"></script>
<body>
<form action="/cus/customerReg.do" method="post">
    <table>
        <tr>
            <td colspan="3" style="text-align: center">请填写用户信息</td>
        </tr>
        <tr>
            <td>用户名：</td>
            <td><input type="text" name="name" id="name"></td>
            <td><span id="namemsg">请填写相应的信息</span></td>
        </tr>
        <tr>
            <td>密码：</td>
            <td><input type="password" name="pwd"></td>
            <td>请填写相应的信息</td>
        </tr>
        <tr>
            <td>确认密码：</td>
            <td><input type="password" name="rpwd"></td>
            <td>请填写相应的信息</td>
        </tr>
        <tr>
            <td>真实姓名：</td>
            <td><input type="text" name="realname"></td>
            <td></td>
        </tr>
        <tr>
            <td>性别：</td>
            <td><input type="radio" name="sex" value="male">男<input type="radio" name="sex" value="female">女</td>
            <td></td>
        </tr>
        <tr>
            <td>年龄：</td>
            <td><input type="text" name="age"></td>
            <td></td>
        </tr>
        <tr>
            <td>身份证号：</td>
            <td><input type="text" name="cardno"></td>
            <td></td>
        </tr>
        <tr>
            <td>家庭住址：</td>
            <td><input type="text" name="address"></td>
            <td></td>
        </tr>
        <tr>
            <td>电话号码：</td>
            <td><input type="text" name="phoneno"></td>
            <td></td>
        </tr>
        <tr>
            <td>电子邮箱：</td>
            <td><input type="text" name="email"></td>
            <td></td>
        </tr>
        <tr>
            <td colspan="3" style="text-align: center">
                <input type="submit" value="注册">
            </td>
        </tr>
    </table>
</form>
<script>
    $(function () {
        $("#name").blur(function () {
            $.ajax({
                type: 'post',
                url: '/cus/checkName.do',
                data: {
                    name: $("#name").val()
                },
                success: function (result) {
                    if (result == "true") {
                        $("#namemsg").html("<font color='red'>用户名已经被注册</font>");
                    } else {
                        $("#namemsg").html("<font color='green'>可以使用</font>");
                    }
                }
            });
        });
    })


</script>

</body>
</html>
